<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8">
	<meta name="viewport" content="width=device-width,minimum-scale=1,maximum-scale=1,user-scalable=no">
	<title>大数据融合与挖掘分析平台</title>
	<link rel="stylesheet" type="text/css" href="/layui/css/layui.css">
	<link href="/css/common.css" type="text/css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="/css/nav.css">
	<link rel="stylesheet" type="text/css" href="/css/iconfont.css">
	<link href="/css/bootstrap.min.css" title="" rel="stylesheet" />
	<link title="" href="/css/body.css" rel="stylesheet" type="text/css" />
	<link title="" href="/css/style.css" rel="stylesheet" type="text/css" />
	<link title="blue" href="/css/dermadefault.css" rel="stylesheet" type="text/css" />
	<link title="green" href="/css/dermagreen.css" rel="stylesheet" type="text/css" disabled="disabled" />
	<link title="orange" href="/css/dermaorange.css" rel="stylesheet" type="text/css" disabled="disabled" />
	<link href="/css/templatecss.css" rel="stylesheet" title="" type="text/css" />
	<script src="/js/jquery-1.11.1.min.js" type="text/javascript"></script>
	<script src="/layui/layui.js"></script>
	<script src="/js/alert.js"></script>
	<script src="/js/echarts.min.js"></script>
	<script src="/js/jquery.cookie.js" type="text/javascript"></script>
	<script src="/js/bootstrap.min.js" type="text/javascript"></script>
	<script src="/js/style.js"></script>
	<!--angular ui--->
	<link rel="stylesheet" title="" type="text/css" href="/css/ui-layout.css" />
	<script src="/js/angular.min.js"></script>
	<script src="/js/ui-layout.js"></script>
</head>
<body>
<!-- 头部导航 -->
<div class="jzy_w_max jzy_h_50 br_12">
	<!--菜单1-->
	<div class="jzy_h_50 br_12 br_11_hove lt top-txt">
		<a class="cr_h_0 fs_14" href="">大数据融合与挖掘分析平台</a>
	</div>


	<!--头像-->
	<div class="jzy_w_50 jzy_h_50 br_12 br_11_hove rt top-txt logo">
		<img class="jzy_boy_18" src="/images/touxiang.jpg" width="36" height="36">

		<!-- 头像下拉菜单 -->

		<div class="jzy_w_270 jzy_h_408 br_h_0 top_nav">
			<!--头像跟用户名-->
			<div class="jzy_w_max jzy_h_50 lt" style="margin-top: 15px"><img class="jzy_boy_18" src="/images/touxiang.jpg" width="36" height="36"></div>
			<div class="jzy_w_max jzy_h_30 lt" style="line-height: 30px; border-bottom: 1px solid #e2e2e2">17812100232</div>
			<!--用户公共操作权限-->
			<div class="jzy_w_250 jzy_h_250 lt" style="padding: 10px">
				<div class="jzy_w_80 jzy_h_80 lt br_h_2_hove">
					<a>
						<p class="jzy_h_30"><img src="/images/icon/jbzl.png"></p>基本资料
					</a>
				</div>
				<div class="jzy_w_80 jzy_h_80 lt br_h_2_hove">
					<a>
						<p class="jzy_h_30"><img src="/images/icon/smrz.png"></p>基本资料
					</a>
				</div>
			</div>
			<!--退出登录-->
			<div class="jzy_w_max jzy_h_42 lt br_h_9" style="background: #f5f5f6; line-height: 45px"><a href="/index">退出平台</a></div>
		</div>
	</div>
	<!--菜单3-->
	<div class="jzy_w_90 jzy_h_50 br_12 br_11_hove rt top-txt">
		<a class="cr_h_0 fs_14">权限设置</a>
		<!-- 头像下拉菜单 -->
		<div class="jzy_w_90 br_h_0 top_nav nav2">
			<p class="p"><a href="">新建权限</a></p>
			<p class="p"><a href="">角色列表</a></p>
		</div>
	</div>
</div>
<!--左侧主导航-->
<div class="jzy_w_180 lt main_height main_left nav" style="background: #333744">
	<div class="nav-top">
		<div id="mini" style="background: #4a5064; text-align: center"><img src="/images/icon/suofang.png" width="20"></div>
	</div>
	<ul>
		<li class="nav-item" id="home">
			<a href="/page/home1"><i class="my-icon nav-icon"></i><span>首页</span></a>
		</li>
		<li class="nav-item" id="ronghe1">
			<a href="javascript:;" style="background: #4d58cd"><i class="my-icon nav-icon"></i><span>数据融合及预处理模块</span></a>
		</li>
		<li class="nav-item" id="ronghe2">
			<a href="" style="background: #5f638f"><i class="my-icon nav-icon"></i><span>数据融合算法</span></a>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据聚类</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href="/page/Kmeans"><span>k均值(K-means)</span></a></li>
				<li><a href=""><span>层次聚类</span></a></li>
				<li><a href=""><span>高斯混合模型</span></a></li>
				<li><a href=""><span>隐狄利克雷分布</span></a></li>
				<li><a href=""><span>InfoMap</span></a></li>
			</ul>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据特征融合算法</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href=""><span>时空卷积神经网络</span></a></li>
				<li><a href=""><span>动态路由</span></a></li>
				<li><a href=""><span>神经协同滤波</span></a></li>
				<li><a href=""><span>Transformer</span></a></li>
			</ul>
		</li>
		<li class="nav-item" id="ronghe">
			<a href="" style="background: #5f638f"><i class="my-icon nav-icon"></i><span>数据预处理技术</span></a>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据特征表示学习</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href="/page/feature"><span>Skip-gram</span></a></li>
				<li><a href=""><span>Glove</span></a></li>
				<li><a href=""><span>Node2vec</span></a></li>
				<li><a href=""><span>SDNE</span></a></li>
				<li><a href=""><span>DeepWalk</span></a></li>
				<li><a href=""><span>TF-IDF</span></a></li>
				<li><a href=""><span>PageRank</span></a></li>
			</ul>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据降维</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href="/page/PCA"><span>主层分分析(PCA)</span></a></li>
				<li><a href=""><span>核主层分分析(kernal-PCA)</span></a></li>
				<li><a href=""><span>因子分析(FactorAnalysis)</span></a></li>
				<li><a href=""><span>多维缩放</span></a></li>
				<li><a href=""><span>流形学习</span></a></li>
				<li><a href=""><span>变分自编码器</span></a></li>
				<li><a href=""><span>线性判别分析</span></a></li>
			</ul>
		</li>
		<li class="nav-item" id="ronghe3">
			<a href="javascript:;" style="background: #4d58cd"><i class="my-icon nav-icon"></i><span>深度挖掘及演化模块</span></a>
		</li>
		<li class="nav-item" id="wa">
			<a href="javascript:;" style="background: #5f638f"><i class="my-icon nav-icon"></i><span>深度挖掘算法</span><i class="my-icon"></i></a>

		</li>
		<li class="nav-item" id="yanhua">
			<a href="javascript:;" style="background: #5f638f"><i class="my-icon nav-icon"></i><span>深度演化技术</span><i class="my-icon"></i></a>

		</li>
		<li class="nav-item" id="wa1">
			<a href="javascript:;" style="background: #5f638f"><i class="my-icon nav-icon"></i><span>挖掘算法</span><i class="my-icon"></i></a>

		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据分类</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href="/page/KNN"><span>k邻近(KNN)</span></a></li>
				<li><a href="/page/LR"><span>逻辑回归(LR)</span></a></li>
				<li><a href="/page/SVM"><span>支持向量机(SVM)</span></a></li>
				<li><a href="/page/modelList"><span>决策树</span></a></li>
				<li><a href="/page/job"><span>贝叶斯</span></a></li>
			</ul>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据回归</span><i class="my-icon nav-more"></i></a>
			<ul>
				<li><a href="/page/linearRegression"><span>线性回归</span></a></li>
				<li><a href="/page/MCAlgorithm"><span>最小二乘回归</span></a></li>
				<li><a href="/page/MLJoblist"><span>贝叶斯回归</span></a></li>
			</ul>
		</li>

		<li class="nav-item" id="fengxian">
			<a href="javascript:;" style="background: #4d58cd"><i class="my-icon nav-icon"></i><span>风险分析及预警模块</span></a>
		</li>

		<li class="nav-item" id="kg">
			<a href="javascript:;" style="background: #4d58cd"><i class="my-icon nav-icon"></i><span>知识图谱可视化模块</span></a>
		</li>

		<li class="nav-item" id="guanli">
			<a href="javascript:;" style="background: #4d58cd"><i class="my-icon nav-icon"></i><span>数据管理模块</span></a>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>数据库管理</span><i class="my-icon"></i></a>
		</li>
		<li class="nav-item">
			<a href="javascript:;"><i class="my-icon nav-icon"></i><span>文件管理</span><i class="my-icon"></i></a>
		</li>

	</ul>
</div>

<!--主内容框架-->
<div class="main_height main_index lt" style="background: #f2f4f8;">

	<div class="left" style="width:500px !important">
		<div class="main-left width-30" style="margin-top:25px">
			<table class="content" border="0" cellspacing="0" cellpadding="0">
				<tbody>
				<tr>
					<input id="lr"  name="role_auth_ids" type="hidden" value="lr">
					<td class="left-txt"><span class="c-red">*</span>数据：</td>
					<td>
						<div id="AUTH-B" style="width:400px">选择数据</div>
						<!--隐藏域 用于记录已选中的ID号 : 格式为 ,ID,ID,ID,-->
						<input id="IDa"  name="role_auth_ids" type="hidden" value="">
					</td>
				</tr>
				<tr>
					<td class="left-txt"><span class="c-red">*</span>参数：</td>
					<td><textarea style="width:400px" class="input-text" id="params" type="text" placeholder="例如: arg1=value1,arg2=value2"></textarea></td>
				</tr>
				<tr>
					<td></td>
					<td>
						<span><input class="Jun-TiJiao" id="exeJob" type="button" value="执行"></span>
					</td>
				</tr>


				</tbody>
			</table>
		</div>
	</div>
	<div class="right" style="width:1150px !important;display: flex;">
		<!--<div style="height: 40px;font-size: 18px;color:#fff">展示区：</div>-->
		<div style="width:100%;padding-left: 1px; width:550px;">
			<img id="img" style="width:450px" src="/GRA_ISM/output/liuchengtu.png">
		</div>
		<!--<div style="height: 40px;font-size: 18px;color:#fff">数据区：</div>-->
		<div id="container" style="height: 700px;width:600px;display:none"></div>
		<table class="content" border="0" cellspacing="0" cellpadding="0">
			<tbody>
			<!--<tr style="margin-top:50px">
                <td class="left-txt">准确率：</td>
                <td><input style="width:400px" readonly="true" class="input-text" id="jobName" type="text"></td>
            </tr>-->
			</tbody>
		</table>
	</div>
</div>
<!--多功能面板-->
<!--权限列表弹窗-->
<!--遮罩层-->
<div id="mask" class="mask"></div>
<div class="convenient" style="height:200px;max-height: 200px;overflow-y: scroll;">
	<div class="top"><span class="left">模型选择</span><span class="right"><button type="button" id="close">×</button></span></div>
	<!--已选区域-->
	<div id="YXZ">
		<span class="txt">已选区域: </span>
	</div>
	<!--未选区域-->
	<div id="WXZ">
		<span class="txt">可选区域: </span>
		<div id=><a>' + data[i].name + '</a><span>+</span></div>
	</div>
	<!--确认区域-->
	<div id="TJ">
		<span class="txt"></span>
		<span class="right"><input id="anniu-1" class="anniu-1" name="" type="submit" value="确认"></span>
	</div>
</div>
<div id="maska" class="maska"></div>
<div class="convenienta" style="height:200px;max-height: 200px;overflow-y: scroll;">
	<div class="top"><span class="left">数据选择</span><span class="right"><button type="button" id="closea">×</button></span></div>
	<!--已选区域-->
	<div id="YXZa">
		<span class="txt">已选区域: </span>
	</div>
	<!--未选区域-->
	<div id="WXZa">
		<span class="txt">可选区域: </span>
		<div id="3"><a>sterilizedmilk_for_classfication.csv</a><span>+</span></div>
		<div id="7"><a>iris</a><span>+</span></div>
		<div id="8"><a>k-means_dataset1</a><span>+</span></div>
		<div id="9"><a>leastsq_dataset1</a><span>+</span></div>
		<div id="10"><a>pca_dataset1</a><span>+</span></div>
		<div id="11"><a>regression_dataset1.csv</a><span>+</span></div>
	</div>
	<!--确认区域-->
	<div id="TJa">
		<span class="txt"></span>
		<span class="right"><input id="anniu-1a" class="anniu-1a" name="" type="submit" value="确认"></span>
	</div>
</div>
<!--弹窗添加或修改内容必备的代码-->
<div id="show">
	<iframe id="popup" name="popup" marginwidth=0 width="100%" frameBorder=0 scrolling=yes></iframe>
</div>
<script type="text/javascript" src="/js/nav.js"></script>
<script src="/js/jump.js"></script>
<script type="text/javascript" th:inline="javascript">
			var layer=null;
			layui.use("layer",function(){
				layer = layui.layer;
			});
			$("#AUTH-B").text('sterilizedmilk_for_classfication.csv');
			/*<![CDATA[*/
			var uuid = /*[[${uuid}]]*/  null;
			/*]]>*/
			function sleep(numberMillis) {
				var now = new Date();
				var exitTime = now.getTime() + numberMillis;
				while (true) {
					now = new Date();
					if (now.getTime() > exitTime)
					return;
					}
			}
			$('#exeJob').on('click',function(){
                var dataset=$("#AUTH-B").text();
                var params=$("#params").val();
                var lr=$("#lr").val();
                if(uuid==null){
					uuid=$("#ID").val();
				};
                var modelId=uuid;
			   	var ui = document.getElementById("container");
    			ui.style.display="block";//display为空的话会好使，为block会使后边的空间换行

		    });

		    var dom = document.getElementById("container");
			var myChart = echarts.init(dom);
			var app = {};
			option = null;
			option = {
				title: {
					text: '结果图',
					textStyle: {
                                color: '#fff'
                            }
				},
				tooltip: {
					trigger: 'item',
					formatter: "{a} <br/>{b} : {c}%"
				},
				toolbox: {
					feature: {
						dataView: {readOnly: false},
						restore: {},
						saveAsImage: {}
					}
				},

				series: [
					{
						name:'',
						type:'funnel',


						min: 0,
						max: 100,
						minSize: '0%',
						maxSize: '100%',
						sort: 'descending',
						gap: 2,
						label: {
							show: true,
							position: 'inside'
						},
						labelLine: {
							length: 10,
							lineStyle: {
								width: 1,
								type: 'solid'
							}
						},
						itemStyle: {
							borderColor: '#fff',
							borderWidth: 1
						},
						emphasis: {
							label: {
								fontSize: 20
							}
						},
						data: [
							{value: 40, name: '蛋白质'},
							{value: 20, name: '脂肪'},
							{value: 80, name: '非脂乳固体'},
							{value: 100, name: '酸度、汞、铅、砷、镉、黄曲霉素'}
						]
					}
				]
			};
			;
			if (option && typeof option === "object") {
				myChart.setOption(option, true);
			}


		</script>
</body>
</html>
